<template>
  <div class="reg-step__3">
    <div class="reg-title">
      <div><span class="big">3</span>教育经历</div>
      <div class="line-height-22">
        完善教育经历，为简历加分～ <br />填写最高学历
      </div>
    </div>
    <div class="wrapper-form">
      <a-form
        :rules="rules"
        :model="formData"
        ref="formRef"
        :label-col="{ span: 5 }"
        size="large"
      >
        <a-form-item label="学校名称" name="schoolName">
          <a-input
            size="large"
            v-model:value="formData.schoolName"
            placeholder="请输入学校名称"
          ></a-input>
        </a-form-item>
        <a-form-item label="学历" name="degreeCode">
          <a-select
            :options="DEGREE_LIST_DICT"
            v-model:value="formData.degreeCode"
            size="large"
            placeholder="请选择"
          >
          </a-select>
        </a-form-item>
        <a-form-item label="专业" name="major">
          <a-input
            size="large"
            v-model:value="formData.major"
            placeholder="请输入专业"
          ></a-input>
        </a-form-item>
        <a-form-item label="时间段" name="time">
          <a-range-picker
            v-model:value="formData.time"
            size="large"
            style="width: 100%"
            picker="month"
            :placeholder="['请选择时间段']"
          />
        </a-form-item>
        <a-form-item label="在校经历">
          <a-textarea
            size="large"
            :rows="5"
            :max="150"
            placeholder="请输入在校经历"
            v-model:value="formData.experience"
          />
        </a-form-item>
      </a-form>
      <div class="btn-box">
        <a-button type="primary" @click="onBackClick">上一步</a-button>
        <a-button type="primary" @click="onNext">下一步</a-button>
      </div>
    </div>
  </div>
</template>

<script>
import { DEGREE_LIST_DICT } from '@/utils/dict';
import { step4Rules as rules } from '../util';
import UserService from '@/api/user';
import ResumeService from '@/api/resume';
import { message } from 'ant-design-vue';
import { Storage } from '@/utils/Storage';
import dayjs from 'dayjs';

export default {
  emits: ['on-next', 'on-last'],
  data() {
    return {
      formData: {
        schoolName: '',
        degreeCode: null,
        time: null,
        major: '',
        experience: '',
      },
      rules,
      DEGREE_LIST_DICT,
      Register_2: Storage.get('Register_2'),
    };
  },
  methods: {
    async onNext() {
      try {
        await this.$refs.formRef?.validate();
        const params = {
          ...this.formData,
          startTime: this.formData.time?.[0]?.format('YYYY-MM') || '',
          endTime: this.formData.time?.[1]?.format('YYYY-MM') || '',
          time: null,
        };
        delete params.time;

        const userServiceMethod = this.Register_2
          ? ResumeService.editSeekerEducationExperience
          : UserService.improveEducationExperience;

        if (!this.Register_2) {
          delete params.id;
        }
        const resp = await userServiceMethod(params);
        if (resp.code === 200) {
          message.success('操作成功');
          Storage.remove('Register_2');
          this.$emit('on-next', 3);
        } else {
          message.error(resp?.msg || '操作失败');
        }
      } catch (error) {
        console.log(error);
      }
    },
    onBackClick() {
      Storage.set('Register_1', true);
      this.$emit('on-next', 1);
    },
    async selectSeekerImprove() {
      try {
        const resp = await UserService.selectSeekerImprove();
        if (resp.code === 200) {
          console.log(resp.data, 'data');
          const data = resp.data.educationExperienceBo;
          this.formData = Object.assign(this.formData, data);

          const times = [];
          if (data.startTime) {
            times.push(dayjs(`${data.startTime}-01`));
          } else {
            times.push(null);
          }
          if (data.endTime) {
            times.push(dayjs(`${data.endTime}-01`));
          } else {
            times.push(null);
          }
          this.formData.time = times;
          this.userStore.setUserInfo(data);
        }
      } catch (error) {
        console.log(error);
      }
    },
  },
  mounted() {
    if (this.Register_2) {
      //返回上一步
      this.selectSeekerImprove();
    }
  },
};
</script>

<style lang="scss" scoped>
.reg-step__3 {
  box-sizing: border-box;
  padding: 0 302px 103px 278px;

  .line-height-22 {
    line-height: 22px !important;
    padding-left: 26px !important;
  }

  .wrapper-form {
    margin-top: 20px;
  }
  .btn-box {
    text-align: center;
    margin-top: 28px;
    :deep(.ant-btn) {
      background-color: #1890ff;
      border-color: #1890ff;
      width: 160px;
      margin-left: 130px;
    }
  }
}
</style>
